import React, { Component } from 'react';
import "../styles/Login.scss"
import * as service from '../api/index'

class Login extends Component {
    constructor(props) {
        super(props)
        this.state = { phone: '', pass: '' }
    }

    handleChange(e) {
        this.setState({ [e.target.name]: e.target.value })
    }

    async login() {
        var res = await service.user_login(this.state)
        console.log(res);

        if (res.status == 201) {
            //(res.data.code == 200) 找不到
            // localStorage.setItem('token', res.data.token)
            // localStorage.setItem('userinfo', JSON.stringify(res.data.userinfo))
            this.props.history.push('/index/home')
        } else {
            alert(res.data.msg)
            this.props.history.push('/login')
        }
    }


    async register() {
        var res1 = await service.user_register(this.state)
        console.log(res1);
    }
    render() {
        return (
            <div className="login" >
                <h2>爱途旅游</h2>
                <div className='inps'>
                    <input type="text" name='phone' placeholder='请输入用户名' value={this.state.phone} onChange={(e) => { this.handleChange(e) }} />
                </div>
                <div className='inps'>
                    <form>
                        <input type="Password" name='pass' placeholder='请输入密码' value={this.state.pass} onChange={(e) => { this.handleChange(e) }} />
                    </form>
                </div>
                <div className='bts' >
                    <span onClick={() => { this.login() }} >登录</span>
                </div>
                <div className='btns' >
                    <span onClick={() => { this.register() }}>注册</span>
                </div>
                <p onClick={() => { this.props.history.push('/xieyi') }}>登录或注册代表您同意 <span>用户服务协议</span></p>
            </div>
        );
    }
}

export default Login;